<template>
  <div class="about">
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item>1</van-swipe-item>
      <van-swipe-item>2</van-swipe-item>
      <van-swipe-item>3</van-swipe-item>
      <van-swipe-item>4</van-swipe-item>
    </van-swipe>

    <van-grid clickable :column-num="10">
      <van-grid-item  class="my-icon" class-prefix="my-icon-4" name="钱袋"  icon="my-icon-4" text="路由跳转" to="/" />
      <van-grid-item icon="home-o" text="路由跳转" to="/" />
      <van-grid-item icon="home-o" text="路由跳转" to="/" />
      <van-grid-item icon="home-o" text="路由跳转" to="/" />
      <van-grid-item icon="home-o" text="路由跳转" to="/" />
      <van-grid-item icon="home-o" text="路由跳转" to="/" />
      <van-grid-item icon="home-o" text="路由跳转" to="/" />
      <van-grid-item icon="search" text="URL 跳转" url="/" />
    </van-grid>
<van-grid  class="gird" :gutter="5" :border="false">
  
 <van-grid-item
  v-for="(item,index) in gridtextlist"
  :key="index"
  :text="item.text"
  :icon="item.photo"
  :to="item.to"/>
 {{item}}
 </van-grid>
<div id="main" style="width: 600px;height:400px;"></div>
  </div>
</template>
<script>
export default {
  name: 'Bank',
  data() {
    return {
       msg: 'Welcome to Your Vue.js App',
  gridtextlist:[
  {
  text:"女性专区",
  icon:"n",
  photo:require('../assets/01.png'),
  to:"/"
  },
  {
  text: "无醇",
  icon:"w",
  photo:require('../assets/01.png'),
  to:"/login"
  },
  {
  text:"聚会畅想",
  icon:"j",
  photo:require('../assets/01.png')
  },
  {
  text:"关于爱情",
  icon:"g",
  photo:require('../assets/01.png')
  },
  {
  text:"火锅绝配",
  icon:"h",
  photo:require('../assets/01.png')
  },
  {
  text:"套餐推荐",
  icon:"template",
  photo:require('../assets/01.png')
  },
  {
  text:"送礼服务",
  icon:"scoped",
  photo:require('../assets/01.png')
  },
  {
  text:"侍酒专区",
  icon:"sh",
  photo:require('../assets/01.png')
  }, 
 ],
      img:[
        require("../assets/01.png"),
        require("../assets/01.png"),
        require("../assets/01.png")
      ]
    }
  },
 mounted() {
 /*ECharts图表*/
 
 }
}
            
  


</script>
<sc
<style>
.my-swipe .van-swipe-item {
  color: #fff;
  font-size: 20px;
  line-height: 150px;
  text-align: center;
  background-color: #39a9ed;
}
</style>
